
<link rel="stylesheet" href="jquery/easyui/themes/default/easyui.css">
<link rel="stylesheet" href="jquery/easyui/themes/icon.css">
 <link rel="stylesheet" href="dropzonefileupload/dropzone.css" >
<body>


<div style="">
	<div id="mydropzone" class="dropzone"></div>
</div>	
<div style="height:60%">
    <table id="easyui_datagrid_select_temp" style="border:1px solid blue" >

    </table>
</div>


<script src="https://upload.shinehao.com.cn/20180816150739jquery-1.8.3.min.js"></script>
<script src="https://upload.shinehao.com.cn/20180816145716jquery.easyui.min.js"></script>
<script src="https://upload.shinehao.com.cn/20180816151727easyui-lang-zh_CN.js"></script>
<script src="https://upload.shinehao.com.cn/20180816150641dropzone.min.js"></script>
<script src="js/base.js"></script>
<script>

var type = 999;
var orderNo = "SCstatic";
$(function(){
    $("body").bind("click",function(){
        $('#easyui_datagrid_select_temp').combogrid("showPanel");
    })
    
    
    $('#easyui_datagrid_select_temp').combogrid({
        mode:"remote",
        url:serverUrl+"/fileManager/getFileList",
        queryParams: {
            type:type,
            orderNo:orderNo
        },
        idField: 'id',
        textField: 'temp_name',
        columns:[[
            {field:'id',title:'id'},
            {field:'fileName',title:'文件名',align:"center"},
            {field:'url',title:'地址',align:"center",formatter: function(value,row,index){
				return '<button  onclick="download("'+value+'")">下载</button>';
			}}
        ]],
        height:"10%",
        width:"50%",
        panelWidth:"100%",
        panelHeight:"50%",
        //rownumbers:true,
        //fitColumns:true,
        pagination:false,
        loadMsg:"加载中,请等待...",
        singleSelect:true,
        align:"center",
        //toolbar: '#easyui_datagrid_source_fac_tool',
        loadFilter: function(data){
          return data.data;  
        },
        keyHandler: {
            enter: function(e){
            },
            query: function (q) {
                $('#easyui_datagrid_select_temp').combogrid("grid").datagrid("reload", {
                    'fileName': q,
                    'type':type,
                    'orderNo':orderNo
                });
                $('#easyui_datagrid_select_temp').combogrid("setValue",q);
            },
            up: function (e) {
                
            },
            down: function (e) {
                
            }
        },
        onLoadSuccess:function(data){
            if(data.total > 0) {
                $("input[type='text']").focus();
                return;
            }  
            //$(this).datagrid('appendRow', { color: '<div style="text-align:center;color:red">没有相关记录！</div>' }).datagrid('mergeCells', { index: 0, field: 'color', colspan: 3});  
            $("input[type='text']").focus();
            $('#easyui_datagrid_select_temp').combogrid("showPanel");
        },
        /*onSelect:function(index,row){
            console.info(row);
            var self = $(window.parent.document).find("["+dom.split(":")[0]+"='"+dom.split(":")[1]+"']");
            //console.info("myid:"+$(self).attr("myid")+":"+$(self).length+":"+"'"+dom.split(":")[0]+"'");
            //console.info("id:"+$(self).attr("id")+":"+$(self).length+":"+"'"+dom.split(":")[0]+"'");
            //console.info($(self).attr("'"+dom.split(":")[0]+"'"));
            //物料代码 色号 颜色描述 规格 填充
            
            $("input[type='text']").focus();
            $('#easyui_datagrid_source_fac').combogrid("showPanel");
        },*/
        onClickRow:function(index,row){
            console.info(row);
            window.open(row.url);
        }
    });
    $('#easyui_datagrid_select_temp').combogrid("showPanel");
    $("input[type='text']").focus();
})


</script>
<script>
   Dropzone.autoDiscover = false;
   var myDropzone = new Dropzone("div#mydropzone", { 
		url: serverUrl+"/fileManager/uploadFile?order_no="+orderNo+"&type="+type,//上传地址
		paramName: "file",//文件类型
		maxFilesize: 5, // MB
		maxFiles: 1,//可上传数量
		acceptedFiles: "",//上传文件类型
        dictResponseError: '文件上传失败!',//上传失败提示
        dictInvalidFileType: "你不能上传该类型文件,文件类型只能是*.jpg,*.gif,*.png。",//类型错误提示
        dictFallbackMessage:"浏览器不受支持",
        dictFileTooBig:"文件过大上传文件最大支持.",
        dictMaxFilesExceeded:"上传文件数量过多，上传失败,请删除",
        //previewsContainer:"#adds", //显示的容器
        //previewTemplate: document.querySelector('#dz-preview dz-file-preview').innerHTML,//设置显示模板
        addRemoveLinks:true,
        dictCancelUpload:"取消上传",
        dictCancelUploadConfirmation:"确认取消上传",
        dictRemoveFile:"删除",
        clickable:true,
        //createImageThumbnails: true,
        //maxThumbnailFilesize: 10,
        //thumbnailWidth: 80,
        //thumbnailHeight: 80,
        //filesizeBase: 1000,
        init:function(){
            this.on("addedfile", function(file) { 
            //上传文件时触发的事件
                console.log("上传文件时触发的事件");
            });
            this.on("queuecomplete",function(file) {
                //上传完成后触发的方法
                console.log(file);
                console.log("上传完成后触发的方法");
            });
            this.on("removedfile",function(file){
                //删除文件时触发的方法
                console.log("删除文件时触发的方法");
            });
            this.on("success",function(file,retdata){
                //获取后台返回数据
                console.info(retdata);
                window.location.reload();
            })
            this.on("dragover",function(ev){
                console.info(ev);
            })
        }
   });
   function download(url){
	   window.open(url);
   }
</script>
</body>


























